﻿<!--<form method="post" action="index.html">
出生日期：
	<input type="text" name="byear" value="yyyy" size="4" maxlength="4"/>年
	<select name="bmon">
		<option value="">[选择月份]</option>
		<option value="1">一月</option>
		<option value="2">二月</option>
		<option value="3">三月</option>
		<option value="4">四月</option>
		<option value="5">五月</option>
		<option value="6">六月</option>
		<option value="7">七月</option>
		<option value="8">八月</option>
		<option value="9">九月</option>
		<option value="10">十月</option>
		<option value="11">十一月</option>
		<option value="12">十二月</option>
	<select> 月
	<input type="text" name="bday" value="dd" size="2" maxlength="2" /日
</form>



<body>
	<dt>水果</dt>
	<dd>苹果</dd>
	<dd>桃子</dd>
	<dd>李子</dd>

	<dt>蔬菜</dt>
	<dd>白菜</dd>
	<dd>黄瓜</dd>
	<dd>西红柿</dd>
</body>	-->

<!--<ol type="I">
	<li>sadasdasdas</li>
	<li>1s3g15adg1d3</li>
</ol>-->

<!--<html>
	<body>
		<h1>
			<b>热门活动&nbsp;&nbsp;&nbsp;更多</b>
		</h1>
		<ul type="disc">
			<li>
				<img src="img/QQ图片20191014201026.jpg">
				<p><a href="#">推荐活动丨原创音乐现金榜T榜</a></p>
			</li>
			<li>
				<img src="img/QQ图片20191014201031.jpg">
				<p><a href="#">推荐节目丨《TAImusic》爆笑来袭</a></p>
			</li>
			<li>
				<img src="img/QQ图片20191014201019.jpg">
				<p><a href="#">推荐歌曲丨继续宠爱张国荣</a></p>
			</li>
			<li>
				<img src="img/QQ图片20191014201038.jpg">
				<p><a href="#">推荐活动丨330金属音乐巡演 成都小酒馆音乐空间</a></p>
			</li>
		</ul>
	</body>
</html>-->

<!--<html>
	<body>
		<table border="1px">
			<tr>
				<td colspan="2">学生成绩</td>
				<td>学</td>
			</tr>
			<tr>
				<td>语文</td>
				<td>110</td>
			</tr>
			<tr>
				<td>数学</td>
				<td>110</td>
			</tr>
			<tr>
				<td>总成绩</td>
				<td>220</td>
			</tr>
		</table>
	</body>
</html>-->
<!--<html>
	<body>
		<table border="1px">
			<tr>
				<td colspan="3">学生成绩</td>
				<!--<td>学生</td>
				<td>成绩</td>-->
<!--			</tr>
			<tr>
				<td rowspan="2">张三</td>
				<td>语文</td>
				<td>98</td>
			</tr>
			<tr>
				<td>数学</td>
				<td>95</td>
			</tr>
			<tr>
				<td rowspan="2">李四</td>
				<td>语文</td>
				<td>88</td>
			</tr>
			<tr>
				<td>数学</td>
				<td>91</td>
			</tr>
		</table>
		
		
		
	</body>
	-->

<!--</html>
<html>
	<body>
		<h1>流量调查表</h1>
		<table border="1px">
			<tr>
				<td><b>总页面流量</b></td>
				<td><b>共计来访</b></td>
				<td><b>会员</b></td>
				<td><b>游客</b></td>
			<tr>
				<td>9756488</td>
				<td>97656</td>
				<td>7538087</td>
				<td>43364677</td>
			</tr>
			<tr>
				<td>46776686</td>
				<td>85544</td>
				<td>69357</td>
				<td>568787</td>
			</tr>
			<tr>
				<td>7538087</td>
				<td>546774</td>
				<td>476897</td>
				<td>334545</td>
			</tr>
			<tr>
				<td>平均每人浏览</td>
				<td colspan="3">1.58</td>
		</tr>
		</table>
	</body>
</html>-->

<!--<html>
	<body>
		<h1>h1标题</h1>
		<h6>h6标题</h6>
		<hr/>
		<p><b><em>&nbsp;辞·九门回忆&nbsp;</em><br/></b>
			戏子多秋，可怜一处情深旧，满座衣冠皆老朽，黄泉故事无止休<br/>
			戏无骨，难左右，换过一折又重头，只道最是人间不能留<br />
			&quot;中三门&lt;下三门&quot; &quot;中三门&gt;上三门&quot;<br />
			<img src="img/QQ图片20191014201019.jpg" width="200px" height="100px" alt="咱也不知道咱也不敢问" title="这是啥呀"><br />
			<a href="img/QQ图片20191014201026.jpg">吴国维的风流历史</a>
			<ul type="square">
				<li>国维不得不说的三件事</li>
				<li>吴国维的光辉往事</li>
				<li>国维外面彩旗飘飘</li>
			</ul>
			<ol type="I">
				<li>国维不得不说的三件事</</li>
				<li>吴国维的光辉往事</li>
				<li>国维外面彩旗飘飘</li>
			</ol>
			<table border="1px">
				<tr>
					<td rowspan="2">212宿舍最强阵容</td>
					<td>靳储飒</td>
					<td colspan="2">靳储飒</td>
					<!--<td>靳储飒</td>-->
<!--</tr>
				<tr>
					<!--<td>靳储飒</td>-->
<!--<td>吴国维</td>
					<td>刘浩</td>
					<td>朱坤</td>
				</tr>
				<tr>
					<td>聂立平</td>
					<td>陈之震</td>
					<td>马国龙</td>
					<td>张博然</td>
				</tr>
			</table>
			<hr />
			&copy;靳储飒专属
		</p>
	</body>
</html>-->

<!--<html>
	<head>
		<title>神秘地带</title>
	</head>
	<body>
		<a href="img/index.html" target="_blank">点击进入第一个页面</a>
		
		<a href="http://www.baidu.com" target="_blank">点击进入百度</a>
		
		<a href="https://www.bilibili.com/" target="_blank">点击进入哔哩哔哩</a>
		

	</body>
</html>-->

<!--<html>
	<body>
		<input type="text" name="userName" value="用户名" size="20" maxlength="30"/>
	</body>
</html>
-->

<!--<form>
	<input name="gen" type="radio" value="男" checked />男
	<input name="gen" type="radio" value="女" />女<br />
	
	<input type="checkbox" name="interest" value="sports" />运动<br />
	<input type="checkbox" name="interest" value="talk"checked />聊天<br />
	<input type="checkbox" name="interest" value="play" />玩游戏
	
	<select>
		<option value="" selected>请选择月份</option>
		<option value="1">1月</option>
		<option value="2">2月</option>
		<option value="3">3月</option>
		<option value="4">4月</option>
		<option value="5">5月</option>
		<option value="6">6月</option>
		<option value="7">7月</option>
		<option value="8">8月</option>
		<option value="9">9月</option>
		<option value="10">10月</option>
		<option value="11">11月</option>
		<option value="12">12月</option>
	</select>
	<p>请输入数字:<input type="number" name="num" min="2" max="10" step="1" ></p>
	<input type="submit" />
	
	
</form>-->

<!--<!DOCTYPE <html>
	<head>
		<title>申请表</title>
	</head>
	<body>
		<h1>申请表</h1>
		<form>
			<p>
				姓名:<input type="text"  name="name" />
			</p>
			<p>
				教育程度:<input type="checkbox" name="xueli" id="xueli" value="硕shuosi" checked/>硕士
				<input type="checkbox" name="xueli" value="boshi" />博士
			</p>
			<p>
				常用邮箱:<input type="text" name="email" />
			</p>
			<p>
				性别:<input type="radio"name="gen" value="man"checked />男
				<input type="radio" name="gen" value="woman" />女
			</p>
			<p>
				年龄:<input type="number" name="" />
			</p>
			<p>
				月薪:<input type="number" name="" />
			</p>
			<p>
				附注:<textarea name="" rows="4" cols="15">请在这里键入附注</textarea>
			</p>
			<p>
				国籍<select>
					<option value="">澳大利亚</option>
					<option value="">中国</option>
				</select>
			</p>
			<input type="submit" value="提交"/>
			<input type="reset" value="重置"/>
		</form>
	</body>
</html>-->

<!--<html>
	<head>
		<title>电子产品调查问卷</title>
	</head>
	<body>
		<h1>American Metric 电子产品调查表</h1>
		<form>
			姓名：<p><input type="text" value=""</p>
			购买日期：<input type="text" name="byear" value="" size="4" maxlength="4"/>年
		<select name="bmon">
		<option value="">[选择月份]</option>
		<option value="1">一月</option>
		<option value="2">二月</option>
		<option value="3">三月</option>
		<option value="4">四月</option>
		<option value="5">五月</option>
		<option value="6">六月</option>
		<option value="7">七月</option>
		<option value="8">八月</option>
		<option value="9">九月</option>
		<option value="10">十月</option>
		<option value="11">十一月</option>
		<option value="12">十二月</option>
	<select> 月
		<select name="bmon">
		<option value="">[选择日期]</option>
		<option value="1">1</option>
		<option value="2">2</option>
		<option value="3">3</option>
		<option value="4">4</option>
		<option value="5">5</option>
		<option value="6">6</option>
		<option value="7">7</option>
		<option value="8">8</option>
		<option value="9">9</option>
		<option value="10">10</option>
		<option value="11">11</option>
		<option value="12">12</option>
		<option value="13">13</option>
		<option value="14">14</option>
		<option value="15">15</option>
		<option value="16">16</option>
		<option value="17">17</option>
		<option value="18">18</option>
		<option value="19">19</option>
		<option value="20">20</option>
		<option value="21">21</option>
		<option value="22">22</option>
		<option value="23">23</option>
		<option value="24">24</option>
		<option value="25">25</option>
		<option value="26">26</option>
		<option value="27">27</option>
		<option value="28">28</option>
		<option value="29">29</option>
		<option value="30">30</option>
		<option value="31">31</option>
		</form> 
	</body>
</html>-->

<!--<html>
	<head>
		<title>人人网注册页面</title>
	</head>
	<body>
		<img src="img/renren_titile.gif" />
		<p>人人网，中国<b>最真实、最有效</b>的社会平台，加入<br/>人人网，找回老朋友，结交新朋友。</p>
		<p>电子邮箱：<input type="email" value="" /></p>
		<p>设置密码：<input type="password" value="" /></p>
		<p>真实姓名：<input type="text" value="" /></p>
		<p>
			性别：<input type="radio" value="man" checked />男
			<input type="radio" value="woman" />女
		</p>
		<p>
			生日：<select name="year">
				<option value="1991">1991</option>
				<option value="1992">1992</option>
				<option value="1993">1993</option>
			</select>年
			<select name="mouth">
				<option value="1">1</option>
				<option value="2">2</option>
				<option value="3">3</option>
				<option value="4">4</option>
				<option value="5">5</option>
				<option value="6">6</option>
				<option value="7">7</option>
				<option value="8">8</option>
				<option value="9">9</option>
				<option value="10">10</option>
				<option value="11">11</option>
				<option value="12">12</option>
			</select>月
			<select name="day">
				<option value="1">1</option>
				<option value="2">2</option>
				<option value="3">3</option>
				<option value="4">4</option>
				<option value="5">5</option>
				<option value="6">6</option>
				<option value="7">7</option>
				<option value="8">8</option>
				<option value="9">9</option>
				<option value="10">10</option>
				<option value="11">11</option>
				<option value="12">12</option>
				<option value="13">13</option>
				<option value="14">14</option>
				<option value="15">15</option>
				<option value="16">16</option>
				<option value="17">17</option>
				<option value="18">18</option>
				<option value="19">19</option>
				<option value="20">20</option>
				<option value="21">21</option>
				<option value="22">22</option>
				<option value="23">23</option>
				<option value="24">24</option>
				<option value="25">25</option>
				<option value="26">26</option>
				<option value="27">27</option>
				<option value="28">28</option>
				<option value="29">29</option>
				<option value="30">30</option>
				<option value="31">31</option>
			</select>日
		<p>为什么要填写我的生日？</p>
		我现在：<select name="">
			<option value="">请选择身份</option>
			<option value="student">学生</option>
			<option value="worker">工人</option>
			<option value="teacher">老师</option>
		</select>（非常重要）
		</p>
		<p>
			<img src="img/renren_code.gif" />
			<a href="" />看不清换一张</a>
		</p>
		验证：<input type="text" value=""/><br />
		<br />
		<a href=""><img src="img/renren.gif" /></a>
	</body>
</html>
-->

<!--<html>

	<head>
		<title>QQ注册验证</title>
	</head>

	<body>
		<h2>注册账号</h2> 昵称：
		<input type="text" pattern="[-\wu4E00-\u9FA5]{4,10}" />长度为4-10个字符<br />
		<br /> 密码：
		<input type="password" pattern="[\dA-Za-z]{6,16}" />长度为6-16个字符<br />
		<br /> 确认密码：
		<input type="password" pattern="[\dA-Za-z]{6,16}" />长度为6-16个字符<br />
		<br /> 手机号码：
		<input type="text" pattern="1[3578]\d{9}" /><br />
		<br /> 邮箱：
		<input type="email" pattern="(\d{0-9}\.[a-zA-Z]{2,3}){1,2}" /><br />
		<br /> 年龄：
		<input type="text" pattern="[0,129]{1}" /><br />
		<br />
		<input type="button" value="立即注册">
	</body>

</html>-->

<!--<html>
	<head>
		<link href="img/style.css" type="text/css" rel="stylesheet" />
		
		
		
		
	<style type="text/css">
		p{
			color:  brown
		}
		
	</style>
	</head>
	<body>
		<p style="color: darkgray;">dsgsgssdga sdasda</p>
	</body>
</html>-->

<!--<html>
	<head>
		<title>选择器</title>
		<style type="text/css">
			p{
				font-size:14px ;color: blueviolet;
			}
		</style>
	</head>
	<body>
		<h2>花千骨</h2>
		<p>
			《花千骨》是由<a href="">××传媒集团</a>制作并发行，水水水水水水水水水水水水水水水硕士
		</p>
	</body>
</html>-->

<!--<html>
	<head>
		<style type="text/css">
			h1{
				font: "franklin gothic medium cond"; color: blue;
			}
			
			#wuwuwuwu{font-size: 50px;}
		
			
			
			
	
			
			
			.fasdf{
				font-size: 30px;color: bisque;
			}
		</style>
	</head>
	<body>
		<h1>dsafaf</h1>

		
		

		
		<p class=" fasdf">safsdgsdg</p>
		<p id="wuwuwuwu">fagsgsdfgfdgfdgdfhgff</p>
		
	</body>
</html>-->

<!--<!DOCTYPE html>
<html>
<head lang="en">
	<meta charset="UTF-8">
	<title>使用CSS3结构伪类选择器</title>
	<style>
		/*ul的第一个子元素*/
		ul li:first-child{
			background: red;
		}
		/*ul的最后一个子元素*/
		ul li:last-child{
			background: green;
		}

		/*body下面的第2个p元素*/
		/*p:nth-child(2){*/
			/*background: yellow;*/
		/*}*/
		/*选择到父级里的第一子元素p*/
		p:nth-child(1){
			background: yellow;
		}

		/*父元素里第2个类型为p的元素*/
		p:nth-of-type(2){
			background: blue;
		}
	</style>
</head>
<body>
<!--演示的时候可以先把h2注释掉，等讲解E F:nth-child(n)和E F:nth-of-type(n)时候在打开-->
<!--<h2>结构伪类选择器</h2>-->
<!--<p>p1</p>
	<p>p2</p>
	<p>p3</p>
	<ul>
		<li>li1</li>
		<li>li2</li>
		<li>li3</li>
	</ul>
</body>
</html>-->

<!--<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>CSS3属性选择器的使用</title>
    <style type="text/css">
        /*此段代码只是让结构更美观，后续会详细讲解*/
        .demo a {
            float: left;
            display: block;
            height: 50px;
            width: 50px;
            border-radius: 10px;
            text-align: center;
            background: #aac;
            color: blue;
            font: bold 20px/50px Arial;
            margin-right: 5px;
            text-decoration: none;
            margin: 5px;
        }
        /*存在属性id的元素*/
        /*a[id] {*/
            /*background: yellow;*/
        /*}*/
        /*/!*属性id=first的元素*!/*/
        /*a[id=first] {*/
            /*background: red;*/
        /*}*/
        /*/!*属性class="links"的元素*!/*/
        /*a[class="links"] {*/
            /*background: red;*/
        /*}*/
        /*/!*属性class里包含links字符串的元素*!/*/
        /*a[class*=links] {*/
            /*background: red;*/
        /*}*/
        /*/!*属性href里以http开头的元素*!/*/
        /*a[href^=http] {*/
            /*background: red;*/
        /*}*/
        /*/!*属性href里以png结尾的元素*!/*/
        a[href$=png] {
            background: red;
        }
    </style>
</head>
<body>
<p class="demo">
    <a href="http://www.baidu.com" class="links item first" id="first" >1</a>
    <a href="" class="links active item" title="test website" target="_blank" >2</a>
    <a href="sites/file/test.html" class="links item"  >3</a>
    <a href="sites/file/test.png" class="links item" > 4</a>
    <a href="sites/file/image.jpg" class="links item" >5</a>
    <a href="efc" class="links item" title="website link" >6</a>
    <a href="/a.pdf" class="links item" >7</a>
    <a href="/abc.pdf" class="links item" >8</a>
    <a href="abcdef.doc" class="links item" >9</a>
    <a href="abd.doc" class="linksitem last" id="last">10</a>
</p>
</body>
</html>-->

<!--<html>
	<head>
		<title>望庐山瀑布</title>
	</head>
	<body>
		<h2>望庐山瀑布</h2>
		<p style=" font-size: 14px; color: green;">
			日照香炉生紫烟，<br />
			<br />
			遥看瀑布挂前川。<br />
			<br />
			飞流直下三千尺，<br />
			<br />
			疑是银河落九天。<br />
		</p>
	</body>
</html>-->

<!--<html>
	<head>
		<title>选择器</title>
		
			<style type="text/css">
			h1{
				color: #003580;
			}	
			p{
				font-size: 14px ; color33;
			}
			#first{
				color: #000033;
			}
			.f1{
				color: #F00;
			}
			.f2{
				color: #1F87CC;
			}
			.f3{
				color: #FAA53B;
			}
			.f4{
				color: #0D7114;
			}
			.f5{
				font-weight: 100px;height: 160px;
			}
			.f6{
				font-weight: 200px;height: 130px;
			}
			</style>
		
			
	</head>
	<body>
		<h1>花千骨</h1>
		<p id="first">《花千骨》是由<a href=""><span class=" f1">慈文传媒集团</span></a>制作并发行，<span class="f2">林玉芬、高林豹、梁胜权联合执导，霍建华、赵丽颖</span>领衔主<br />
			演，<span class=" f3">蒋欣、杨烁</span>特别出演， <span class=" f4">张丹峰、李纯、马可、鲍天琦、安悦溪、徐海乔</span>等主演的古装玄幻仙侠剧。<br />
			该剧改编自fresh果果同名小说，讲述少女花千骨与长留上仙白子画之间关于责任、成长、取舍的纯爱虐<br />
			恋[1] 。该剧于2014年5月6日开机，9月15日杀青，8月12日发布中文及英文版的预告片[2] 。 该剧于<br />
			2015年6月9日起每周二、周三晚10点在<span class=" f3">湖南卫视</span>的钻石独播剧场播出。[3] 2015年7月5日起，该剧播放<br />
			时间已经改为每周日、周一晚10点。当天零点在爱奇艺同步更新。[4]</p>
			<img src="img/1.jpg" class="f5"><br />
			<h1>主要演员</h1>
			<img src="img/2.jpg" class="f3">
			<img src="img/3.jpg" class="f3">
	</body>
</html>-->

<!--<html>

	<head>
		<title>开心餐厅</title>
		<link href="test.css" type="text/css"  rel="stylesheet"/>
	</head>

	<body>
		<img src="img/game01.jpg" /><br />
		<br />
		<img src="img/game02.jpg" /><br />
		<p>开心餐厅，让你可以开心的烹饪美味佳肴，从一个简洁的小餐厅起步，逐步打造自己的餐饮大食代。<br /> 烹饪美食，雇佣好友帮忙，装修个性餐厅，获得顾客美誉。
			<br /> 步步精心经营，细心打理，我们都能成为餐饮大亨哦。
		</p>
		<br />
		<img src="img/game03.jpg" /><br />
		<h2 style="color: red;">如何做菜？</h2>
		<p>
			1.点击餐厅中的炉灶，打开菜谱，选择自己要做的食物后，进行烹饪。不断点击炉灶，直到食物进入自动烹饪阶段；<br /> 2.每道菜所需要制作的步骤和烹饪的时间不一样，你可以根据自己的时间和偏好来进行选择，还会有各地特色食物供应哦；
			<br /> 3.烹饪完毕的食物要及时端到餐台上，否则过一段时间会腐坏；
			<br /> 4.食物放在餐台上后，服务员会自动端给顾客，顾客吃完后会付钱给你。
		</p>
		<h2>如何经营餐厅？</h2>
		<p>
			1.自己做老板，当大厨，雇佣好友来做服务员为你打工。心情越好的员工效率越高。员工兼职的份数越少，工作的时间越短心情越好；好友间亲密度越高，可雇用的时间越长；<br /> 2.随着等级的升高，可雇佣的员工、可购买的炉灶、餐台、经营面积都会随之增加；
			<br /> 3.餐桌椅的摆放位置也很有讲究，它会影响顾客和服务员行走路程。
		</p>
		<h2>如何吸引顾客？</h2>
		<p>
			1.美誉度决定了餐厅的客流量，美誉度高的时候来餐厅的顾客多，美誉度低的时候来餐厅的顾客少；<br /> 2.如果不需要等待，就能及时享用到食物，顾客就会满意地增加餐厅美誉度；与之相反，如果没有吃到食物就离开的顾客会降低美誉度；
			<br /> 3.总而言之，储备充足的食物、及时的服务、足够的餐桌椅是必不可少的！
		</p>
		<h2>如何和好友互动？</h2>
		<p>
			1.不忍眼睁睁看好友餐厅的食物腐坏，那就帮忙端到餐台吧！自己还可以获得经验值奖励；<br /> 2.仓库里的东西可以赠送给好友，直接拖拽到礼物即可赠送；拖拽到收银即可出售。注意哦，每个级别能收到礼物的总价值是有上限的；
			<br /> 3.系统的额外食物奖励可和好友分享，把分享消息发布到开心网动态上，让朋友们一起感受快乐！每天最多可以从5位好友的餐厅领取免费食物，食物将被放入仓库的冷藏室里，可出售给系统，也可以拖到餐台上卖给顾客；
			<br /> 4.在好友需要帮助的时候，给予帮忙，当然啦，你也可以给好友捣捣乱、使使坏。作为奖励，你也会获得经验值和现金。
		</p>
		<img src="img/game04.jpg" /><br />
		<p>
			开心餐厅，让你可以开心的烹饪美味佳肴，从一个简洁的小餐厅起步，逐步打造自己的餐饮大食代。 烹饪美食，雇佣好友帮忙，装修个性餐厅，获得顾客美誉。 步步精心经营，细心打理，我们都能成为餐饮大亨哦。
		</p>
	</body>
	
</html>-->

<!--<html>

	<head>
		<title>爱奇艺热播</title>
		<link href="test.css" type="text/css" rel="stylesheet" />
	</head>

	<body>
		<ul>
			<li>
				<h1>热播</h1>
				<img src="img/img1.png" />
				<h2>神武赵子龙</h2>
				<p>怒，林更新不抱网红抱女神</p>
				<p>点击次数：242445次</p>
			</li>
			<li>
				<img src="img/img2.png" />
				<h2>旋风十一人</h2>
				<p>胡歌变教练在撩前女友</p>
				<p>点击次数：242445次</p>
			</li>
			<li>
				<img src="img/img3.png" />
				<h2>太阳的后裔</h2>
				<p>宋慧乔吃嫩草</p>
				<p>点击次数：242445次</p>
			</li>
			<li>
				<img src="img/img4.png" />
				<h2>山海经之赤影传说</h2>
				<p>娜扎张翰再度联手</p>
				<p>点击次数：242445次</p>
			</li>
		</ul>
	</body>

</html>-->

<!--<html>

	<head>
		<title>申请表</title>
	</head>

	<body>
		<h1>申请表</h1>
		<form>
			<p>
				<label>姓名：<input type="text" name="name" value="" /></label>
			</p>
			<p>
				<label>
					教育程度：<input type="checkbox" name="shuoshi" value="shuoshi" checked />硕士
					<input type="checkbox" name="boshi" value="boshi" />博士
				</label>
			</p>
			<p>
				<label>
					常用邮箱：<input type="email" name="email" value="" />
				</label>
			</p>
			<p>
				<label>
					性别：<input type="radio" name="gen" value="man" checked />男
					<input type="radio" name="gen" value="woman" />女
				</label>
			</p>
			<p>
				<label>
					年龄：<input type="text" name="ago" value="" />
				</label>
			</p>
			<p>
				<label>
					月薪：<input type="text" name="yuexin" value="" />
				</label>
			</p>
			<p>
				<label>
					附注：<textarea cols="15" rows="4">请在这里键入附注</textarea>
				</label>
			</p>
			<p>
				<label>
					国籍：<select>
					<option value="aodaliya">澳大利亚</option>
					<option value="meiguo">美国</option>
					<option value="riben">日本</option>
					<option value="xinjiapo">新加坡</option>
					</select>
				</label>
			</p>
			<input type="submit" />
			<input type="reset" />
		</form>
	</body>

</html>-->

<!--<html>
	<head>
		<title>热门活动</title>
	</head>
	<body>
		<h1>热门活动&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;更多</h1>
		<ul>
			<li>
				<img src="img/QQ图片20191014201026.jpg" />
				<p>推荐活动丨原创音乐现金榜T榜</p>
			</li>
			<li>
				<img src="img/QQ图片20191014201031.jpg" />
				<p>推荐节目丨《TAImusic》爆笑来袭</p>
			</li>
			<li>
				<img src="img/QQ图片20191014201019.jpg" />
				<p>推荐歌单丨继续宠爱张国荣</p>
			</li>
			<li>
				<img src="img/QQ图片20191014201038.jpg" />
				<p>推荐活动丨330金属音乐巡演 成都小酒馆音乐空间</p>
			</li>
		</ul>
	</body>
</html>
-->

<!--<html>

	<head>
		<title>爱奇艺热播</title>
		<link href="test.css" type="text/css" rel="stylesheet" />
	</head>

	<body>
		<h1>热播</h1>
		<ul>
			<li>
				<img src="img/img1.png">
				<h2>武神赵子龙</h2>
				<p>怒，林更新不抱网红抱女神</p>
				<p>点击次数:242445次</p>
			</li>
			<li>
				<img src="img/img1.png">
				<h2>武神赵子龙</h2>
				<p>怒，林更新不抱网红抱女神</p>
				<p>点击次数:242445次</p>
			</li>
			<li>
				<img src="img/img1.png">
				<h2>武神赵子龙</h2>
				<p>怒，林更新不抱网红抱女神</p>
				<p>点击次数:242445次</p>
			</li>
			<li>
				<img src="img/img1.png">
				<h2>武神赵子龙</h2>
				<p>怒，林更新不抱网红抱女神</p>
				<p>点击次数:242445次</p>
			</li>
		</ul>
	</body>

</html>-->

<!--<html>

	<head>
		<title>CSS</title>
	</head>
	<style type="text/css">
		p {
			font: italic bold 20px "楷体";
			color: red;
			text-indent: inherit;
			text-align: left;
		}
	</style>

	<body>
		<p>
			终南有坟，名不老。客奇之，问何故，言乃淮南翁主媗冢。<br /> 元光二年上巳，媗于渭水之滨遇振翊将军韩衿，悦之。
			<br /> 明年，河水决濮阳，上发卒十万救决河，使衿督。 <br /> 媗送别，诉心意。衿以其年尚幼，婉拒之。后三年，衿戍定襄，媗托尺素，书：妾已及笄。 <br /> 复三年，媗随姊陵探长安，约结上左右。每逢衿，且喜且怯。 <br /> 又三年，媗疾，久不愈。衿随大将军青击匈奴，媗恐
			<br/>不复见，追大军十余里，终力竭。呛血白衣，形销骨<br/> 立。 <br/>元狩元年，淮南衡山事发，陵媗皆下狱。衿欲面 之，叩未央宫，额血流地，上弗允。媗殒，衿亲葬于 终南。 <br/> 后长安有歌曰：茔茔蔓草，岁岁不老；风雨如晦，死生为谁。 <br/> 终南有坟，名不老。
		</p>
	</body>

</html>-->

<!--<html>
	<head>
		<title>全部歌手</title>
		<link href="asdafsa .css" type="text/css" rel="stylesheet">
	</head>
	<style type="text/css">
		p{
			line-height: 20px;
		}
	</style>
	<body>
		<h1>全部歌手</h1>
		<p>
		    <span class="f1">A</span>   Fine Frenzy  Air Supply  Akon  Alan Silvestri   Apink  安又琪  安在旭  安室奈美惠  <br />

			<span class="f1">B</span>   Babyface  Backstreet ..   Bandari  Barbra Streisand  Basshunter  Bee Gees   北京天使合唱团  宝儿  宝宝的音乐花园  巴哈尔古丽  巴桑  布仁巴雅尔  <br />

			<span class="f1">C</span>   Chris Garneau  Christina Aguilera  Christina Perri   草原兄妹   蔡卓妍  蔡国庆   陈雅森  陈雷  陈韵若  <br />

			<span class="f1">D</span>   Darby Devon  Darren  Darren Hayes  Daughtry  David Archuleta   Dido   东城卫  东方传奇   刀郎   刁寒  动力火车   邓丽欣  <br />

			<span class="f1">E</span>   Emmylou Harris  Enigma  Ennio Morricone   Eric Clapton   eminem  二手玫瑰  二胡  额尔古纳乐队  <br />

			<span class="f1">F</span>   Fergie  Finger eleven  Flo Rida  Florence + The M..   付笛声  付辛博  佛涯组合   凤凰传奇   飞儿乐团  <br />

			<span class="f1">G</span>   Gretchen Wilson  Greyson Chance  Groove Coverage  关牧村  关菊英  古天乐  古巨基  龚琳娜  龚诗嘉  <br />

			<span class="f1">H</span>   High School Music..  Hilary Duff  >Hit-5  Hollywood Undead  Hope组合  胡松华  胡歌  黄宗泽  黄家驹  黄晓明   黑鸭子  黑龙  <br />

			<span class="f1">I</span>   I Me  IU  Icona Pop  Il Divo  Imagine Dragons  Infinite  Ingrid Michaelson  Isgaard  <br />

			<span class="f1">J</span>   Janet Jackson  Jason Chen  Jason Derulo  Jason Mraz  Jason Wade  吉杰  吉田亚纪子  蒋大为  蒋蒋  蒋雪儿  解小东  酒井法子  <br />

			<span class="f1">K</span>   Kimberley  Kiss组合  kanye west  katie melua  柯有伦  柯有纶  柯震东  筷子兄弟  <br />

			<span class="f1">L</span>   Lana Del Rey  Led Zeppelin  Lee Ssang  Lene Marlin  刘德华   刘德海  李克勤   李双江  林忆莲   林志炫   林志玲  <br />

			<span class="f1">M</span>   MC Hotdog  Michael Bolton  Michael Buble  Michael Jackson  孟非  麦田守望者  麻吉  <br />

			<span class="f1">N</span>   Nat King Cole  Natasha Bedingfield  Naughty Boy  牛朝阳  牛牛  那英  <br />

			<span class="f1">O</span>   Oasis  Oceanlab  Olivia Ong  Olly Murs  欧得洋  欧阳菲菲  <br />

			<span class="f1">P</span>   Pharrell  Phil Collins  Phillip Phillips  彭芳  彭野新儿歌  潘长江  蒲提  <br />

			<span class="f1">Q</span>   邱泽  青山  青山黛玛  青春美少女  青蛙乐队  青鸟飞鱼  <br />

			<span class="f1">R</span>   Rammstein  Ray Charles  Red Hot Chili Pep..  Regina Spektor   容祖儿  容韵琳  荣联合  饶天亮  <br />

			<span class="f1">S</span>   Sara Bareilles  Sarah Brightman  Sarah Connor  Something Corpor..  Sophie Zelmani  司徒兰芳  少女时代  少女时代-太蒂徐  尚雯婕 <br /> 

			<span class="f1">T</span>   Tears For Fears  The Band Perry  The Beatles  The Black Eyed P..  The Cardigans  谭杰希  谭欣懿  谭维维  谭耀文  陶钰玉  <br />

			<span class="f1">U</span>   UVERworld  Usher  u2  <br />

			<span class="f1">V</span>   Vanessa Carlton  Vangelis  Various Artists  Vitas  Vonda Shepard  <br />

			<span class="f1">W</span>   Willie Nelson  Within Temptation  Wiz Khalifa  Wolfgang Amadeu..  Wonder Girls  王菲   王蓉  王蓝茵  <br />

			<span class="f1">X</span>   徐子崴  徐小凤  徐小明  徐怀钰  徐洁儿  谢娜  <br />

			<span class="f1">Y</span>   Yann Tiersen  Yanni  余文乐  俞丽拿  俞灏明  音乐磁场  颜小健  颜羽  <br />

			<span class="f1">Z</span>   Zaho  Zard  中国好声音学员  赵本山  赵薇  郑少秋  郑智化  郑欣宜  钟镇涛  <br />
 </p>
	</body>
</html>-->

<!--<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>列表样式</title>
		<link href="css/家电.css" type="text/css" rel="stylesheet" />
	</head>
	<body>
		<h1>全部商品分类</h1>
		<ul>
			<li><a href="#">图书</a> &nbsp;&nbsp;<a href="#">音像</a> &nbsp;&nbsp;<a href="#">数字商品</a></li>
			<li><a href="#">家用电器</a> &nbsp;&nbsp;<a href="#">手机</a> &nbsp;&nbsp;<a href="#">数码</a></li>
			<li><a href="#">电脑</a> &nbsp;&nbsp;<a href="#">办公</a></li>
			<li><a href="#">家居</a> &nbsp;&nbsp;<a href="#">家装</a> &nbsp;&nbsp;<a href="#">厨具</a></li>
			<li><a href="#">服饰鞋帽</a> &nbsp;&nbsp;<a href="#">个护化妆</li>
			<li><a href="#">礼品箱包</a> &nbsp;&nbsp;<a href="#">钟表</a> &nbsp;&nbsp;<a href="#">珠宝</a></li>
			<li><a href="#">食品饮料</a> &nbsp;&nbsp;<a href="#">保健食品</a></li>
			<li><a href="#">彩票</a> &nbsp;&nbsp;<a href="#">旅行</a> &nbsp;&nbsp;<a href="#">充值</a> &nbsp;&nbsp;<a href="#">票务</a></li>
		</ul>
	</body>
</html>-->

<!--<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>京东读书新闻页面</title>
		<link href="test.css" type="text/css" rel="stylesheet" />
	</head>
	<body>
		<h1>看不见的完美硬币 ：细节的负担</h1>
		<h2>创新公司皮克斯的启示</h2>
		<hr />
		<p>
			2015年05月05日<span> 17:47</span><br />
		
		    <img src="img/book.jpg" /><br />
		</p>
		
		   <h6> 细节从来都是个好东西，完美的细节往往给我们赢得商业上的胜利。</h6>

			<h6> 但是，在皮克斯，这一家满是完美主义设计师的企业里，细节竟然成了负担。</h6>
			
			<h6> 怎么打造完美的细节？又怎么赢得商业上的利益。皮克斯总裁艾德·卡特姆为我们解答。</h6>
		
		
			<h3>看不见的完美硬币：细节的负担</h3>
		<p>	
			在皮克斯，每一部电影都是商业与艺术的双赢。不管这些电影是艺术作品，还是商品，细节都是至关重要的，是决定成败的关键。人们似乎也听过许多关于细节的胜利的故事，但是在皮克斯，设计师们一个个都是完美主义者，细节显然成了皮克斯的负担。这样的太过于重视细节，往往会伤害到企业该有的效率，最终伤害企业的根本。在完美细节和企业应有的效率面前，艾德·卡特姆做出了明智的决策。<br />
			
			皮克斯有一个现象，被我们的制片人叫作“看不见的完美硬币（the perfect coin）”，这个词指代的是皮克斯制作人员对细节的精益求精。有时候，被我们的制片人凯瑟琳?萨拉菲安称为“床头柜上一枚没人会注意到的硬币”这样的细节，也会引得我们的工作人员花上几天甚至数周的时间悉心打磨。凯瑟琳是《怪兽电力公司》一片的制作人员，影片中有一幕戏可以形象地向我们阐释到底什么是“看不见的完美硬币”。在这幕戏中，好奇的小布第一次来到麦克和萨里的公寓，还在蹒跚学步的小婴儿四处探索起来。两个怪物想要制止她，而她还是一步步走到了两摞高高堆起的CD旁，“别乱动！”麦克大喊起来，可是小女孩还是从90多张CD盒摞成的“高塔”底部抽出一张， CD全部倒塌散落在了地板上。麦克抱怨道：“哎，那些CD都是按字母顺序排列好的！”小女孩摇摇摆摆地走开了。这幕场景前后不到3秒钟，观众们只能够看到几个CD盒而已，但皮克斯的制作人员不仅为每一个CD盒制作了封面，还使用了可计算物体在运动时渲染效果变化的着色器。<br />
			
			“你能看到所有CD盒吗？看不到。”萨拉菲安接着说，“把所有CD盒全部设计一遍，这工作有意思吗？其实挺有意思的。我们还真有几位工作人员觉得观众能在近镜头里把每张CD都看得一清二楚，所以就任劳任怨地把每张CD都雕琢了一番。也许，这其中的乐趣只有当事人才能体会吧。”<br />
		</p>
	</body>
</html>-->

<!--<div style="width: 50%; border: 1px solid red; ">
			<h1 style="height: 4em; width: 10em; border: 1px solid red;">
				h1的em测试
			</h1>
			<h1 style="height: 4rem; width: 10rem; border: 1px solid red;">
				h1的rem测试
			</h1>0000008
			
		</div>
		
		<div style="width: 50%; border: 1px solid red;font-size: 4px; ">
			<h1 style="height: 4em; width: 10em; border: 1px solid red;">
				h1的em测试
			</h1>
			<h1 style="height:4rem; width: 10rem; border: 1px solid red;">
				h1的rem测试
			</h1>
			
		</div>-->

<!--<html>

	<head>
		<title>不老梦</title>
		<link href="test.css" type="text/css" rel="stylesheet" /></head>
		<body>
			<div id=" nav"></div>
			<h1>不老梦</h1>
			<p>
					<span class="f1">终南有坟，名不老。客奇之，问何故，言乃淮南翁主媗冢。<br /> 元光二年上巳，媗于渭水之滨遇振翊将军韩衿，悦之。
				<br /> 明年，河水决濮阳，上发卒十万救决河，使衿督。 媗送别，诉心意。衿以其年尚幼，婉拒之。<br /> 后三年，衿戍定襄，媗托尺素，书：妾已及笄。 <br /> 复三年，媗随姊陵探长安，约结上左右。每逢衿，且喜且怯。 <br /> 又三年，媗疾，久不愈。衿随大将军青击匈奴，媗恐不复见，追大军十余里，终力竭。
				<br /> 呛血白衣，形销骨立。 元狩元年，淮南衡山事发，陵媗皆下狱。<br /> 衿欲面之，叩未央宫，额血流地，上弗允。媗殒，衿亲葬于终南。 <br /> 后长安有歌曰：茔茔蔓草，岁岁不老；风雨如晦，死生为谁。 <br/>终南有坟，名不老。</span>
				<br />
				<br /> <span class="f2">银临 - 不老梦<br />
				<br /> 作词：慕清明
				<br />
				<br /> 作曲：银临
				<br />
				<br /> 等不到鬓雪相拥
				<br />
				<br /> 重饮渭水畔 那一盏虔诚 <br />
				<br /> 终究是绸缪青冢 <br />
				<br /> 替我将灞桥柳供奉 <br />
				<br /> 来世再漱月鸣筝 <br />
				<br /> 也许还能道声 久别珍重 <br />
				<br /> 天意总将人捉弄 <br />
				<br /> 怎奈何 身不由己情衷 <br />
				<br /> 于万人中万幸 得以相逢 <br />
				<br /> 刹那间澈净明通 <br />
				<br /> 成为我所向披靡的 勇气和惶恐<br />
				<br /> 裂山海 堕苍穹 <br />
				<br /> 炽烈而哀恸 <br />
				<br /> 诸般滋味皆在其中 <br />
				<br /> 韶华宛转吟诵 <br />
				<br /> 苍凉的光荣 <br />
				<br /> 急景凋年深情难共 <br />
				<br /> 倏忽天地琉璃灯 <br />
				<br /> 光阴过处徒留 皎月几盅 <br />
				<br /> 温柔了十方春冬 <br />
				<br /> 眷你眉目在我眼瞳 <br />
				<br /> 彼时击节讴新声 <br />
				<br /> 唱彻白首之约 抱柱之盟 <br />
				<br /> 摩肩人步履匆匆 <br />
				<br /> 多少相遇 能有始有终 <br />
				<br /> 若要忘却 年少轻狂的痛 <br />
				<br /> 从此后分赴西东 <br />
				<br /> 不如作蜉蝣麻衣 霜染淋漓死生 <br />
				<br /> 恣朝暮 彀长空 <br />
				<br /> 卸去人间妆红 <br />
				<br /> 我终于读懂 <br />
				<br /> 痴心熬尽才可倾城 <br />
				<br /> 唯有亘古寒峰 <br />
				<br /> 能安葬浮生 <br />
				<br /> 至死不渝的一场梦 <br />
				<br /> 天光落笔波折 <br />
				<br /> 岁月都干涸 <br />
				<br /> 只剩别离来不及说 <br />
				<br /> 宁愿折心沐火 <br />
				<br /> 舍不得勘破 <br />
				<br /> 是你唇边夜雨清荷
				<br />
				<br />
			</p>
			</div>
		</body>

</html>-->
	
	
<!--<!DOCTYPE html>

<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>贪吃蛇</title>
    <style type="text/css">
*{margin:0;padding: 0;font-family: "Microsoft YaHei";}
#page{margin-right: auto;margin-left: auto; margin-top: 20px;height: 600px; width: 980px; }
#yard{ width: 800px;border: 1px solid gray;box-shadow: 0 0 10px black; float: right;}
#mark{font-weight: 800;}
#mark_con{ color: red; }
button{width: 50px; }
a{text-decoration:none;}
</style>
<script type="text/javascript">
        //伪常量
        var BLOCK_SIZE = 20;        //格子大小
        var COLS = 40;                        //列数
        var ROWS = 30;                        //行数
        //变量
        var snakes = [];                //保存蛇坐标
        var c = null;                        //绘图对象
        var toGo = 3;                        //行进方向
        var snakecount = 4;                //蛇身数量
        var interval = null;        //计时器
        var foodX = 0;                        //食物X轴坐标
        var foodY = 0;                        //食物Y轴坐标
        var oMark = null;                //分数显示框
        var isPause = false;        //是否暂停
        // 绘图函数
        function draw(){
            c.clearRect(0,0,BLOCK_SIZE * COLS, BLOCK_SIZE * ROWS);
            //画出横线
            for( var i = 1; i <= ROWS; i++ ) {
                c.beginPath();
                c.moveTo(0, i * BLOCK_SIZE);
                c.lineTo(BLOCK_SIZE * COLS, i * BLOCK_SIZE);
                c.strokeStyle = "gray";
                c.stroke();
            }
            //画出竖线
            for(var i = 1; i <= COLS; i++){
                c.beginPath();
                c.moveTo(i * BLOCK_SIZE, 0);
                c.lineTo(i * BLOCK_SIZE, BLOCK_SIZE * ROWS);
                c.stroke();
            }
            //画出蛇
            for (var i = 0; i < snakes.length; i++){
                c.beginPath();
                c.fillStyle = "green";
                c.fillRect(snakes[i].x, snakes[i].y, BLOCK_SIZE, BLOCK_SIZE);
                c.moveTo(snakes[i].x, snakes[i].y);
                c.lineTo(snakes[i].x + BLOCK_SIZE, snakes[i].y);
                c.lineTo(snakes[i].x + BLOCK_SIZE, snakes[i].y + BLOCK_SIZE);
                c.lineTo(snakes[i].x, snakes[i].y + BLOCK_SIZE);
                c.closePath();
                c.strokeStyle = "red";
                c.stroke();
            }
            //画出食物
            c.beginPath();
            c.fillStyle = "yellow";
            c.fillRect(foodX, foodY, BLOCK_SIZE, BLOCK_SIZE);
            c.moveTo(foodX, foodY);
            c.lineTo(foodX + BLOCK_SIZE, foodY);
            c.lineTo(foodX + BLOCK_SIZE, foodY + BLOCK_SIZE);
            c.lineTo(foodX, foodY + BLOCK_SIZE);
            c.closePath();
            c.strokeStyle = "red";
            c.stroke();
        }
        //游戏初始化
        function start(){
            for( var i = 0; i < snakecount; i++){
                snakes[i] = {x: i * BLOCK_SIZE, y: 0};
            }
            addFood();
            //draw();
            oMark.innerHTML = 0;
        }
        //移动函数
        function move(){
            switch(toGo){
                case 1: //左边
                    snakes.push({x: snakes[snakecount - 1].x - BLOCK_SIZE, y: snakes[snakecount - 1].y});
                break;
                case 2: //上边
                    snakes.push({x: snakes[snakecount - 1].x, y: snakes[snakecount - 1].y - BLOCK_SIZE});
                break;
                case 3: //右边
                    snakes.push({x: snakes[snakecount - 1].x + BLOCK_SIZE, y: snakes[snakecount - 1].y});
                break;
                case 4: //下边
                    snakes.push({x: snakes[snakecount - 1].x, y: snakes[snakecount - 1].y + BLOCK_SIZE});
                break;
                default:;
            }
            snakes.shift();
            isEat();
            isDie();
            draw();
        }
        //吃到食物判断
        function isEat(){
            if (snakes[snakecount - 1].x == foodX && snakes[snakecount - 1].y == foodY) {
                oMark.innerHTML = (parseInt(oMark.innerHTML) + 1).toString();
                addFood();
                addSnake();
            }
        }
        //添加蛇身
        function addSnake(){
            snakecount++;
            snakes.unshift({x:BLOCK_SIZE * COLS, y:BLOCK_SIZE * ROWS});
        }
        //交互响应函数
        function keydown(keyCode){
                switch(keyCode){
                        case 37: //左边
                                if(toGo != 1 && toGo != 3)  toGo = 1;break;
                        case 38: //上边
                                if(toGo != 2 && toGo != 4)        toGo = 2;break;
                        case 39: //右边
                                if(toGo != 3 && toGo != 1)         toGo = 3;break;
                        case 40: //下的
                                if(toGo != 4 && toGo != 2)        toGo = 4;break;
                        case 80: //开始/暂停
                                if(isPause){
                                        interval = setInterval(move,200);
                                        isPause = false;
                                        document.getElementById('pause').innerHTML = "Pause";
                                }else{
                                        clearInterval(interval);
                                        isPause = true;
                                        document.getElementById('pause').innerHTML = "Start";
                                }
                                break;
                }
        }
        //制造食物
        function addFood(){
                foodX = Math.floor(Math.random() * (COLS - 1)) * BLOCK_SIZE;
                foodY = Math.floor(Math.random() * (ROWS - 1)) * BLOCK_SIZE;
                // console.log(foodX + " -- " + foodY);
        }
        //死亡判断
        function isDie(){
                if(snakes[snakecount - 1].x == -20 || snakes[snakecount - 1].x == BLOCK_SIZE * COLS 
                        || snakes[snakecount - 1].y == -20 || snakes[snakecount - 1].y == BLOCK_SIZE * ROWS){
                        alert("Game Over!");
                        clearInterval(interval);
                }
                for(var i = 0; i < snakecount - 1; i++){
                        if(snakes[snakecount - 1].x == snakes[i].x && snakes[snakecount - 1].y == snakes[i].y){
                                clearInterval(interval);
                                alert("Game Over!");
                        }
                }
        }
        // 启动函数
        window.onload = function(){
            c = document.getElementById('canvas').getContext('2d');
            oMark = document.getElementById('mark_con');
            start();
            interval = setInterval(move,100);
            document.onkeydown = function(event){
                var event = event || window.event;
                keydown(event.keyCode);
            }
        }
</script>
</head>
<body>

    <div id="page">
        <div id="yard"><canvas id="canvas" height="600px" width="800px"></canvas></div>

        <div id="help">
            <div id="mark">得分：<span id="mark_con"></span></div>
            <!--
            <div id="helper">
                <table>
                    <tr>
                        <td></td>
                        <td><button οnclick="keydown(38);">上</button></td>
                        <td></td>
                    </tr>
                    <tr>
                        <td><button οnclick="keydown(37);">左</button></td>
                        <td><button οnclick="keydown(80);" id="pause">暂停</button></td>
                        <td><button οnclick="keydown(39);">右</button></td>
                    </tr>
                    <tr>
                        <td></td>
                        <td><button οnclick="keydown(40);">下</button></td>
                        <td></td>
                    </tr>
                </table><a href="index.html">再玩一次</a>
            </div>-->
       <!-- </div>
    </div>
    <div style="text-align:center;">
<p>来源:<a href="http://www.mycodes.net/" target="_blank">源码之家</a></p>
</div>
</body>
</html>-->

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<style type="text/css">
			h2,img{
				font-size: 16px;
				color: white;
				text-indent: 1em;
				line-height: 30px;
				background: green;
				background-image: url(img/bang.gif);
				background-repeat: no-repeat;
				background-position: 27% 100%;
				/*vertical-align: top;*/
				background-size: contain;
			}
			ul{
				background: linear-gradient(#F9FBCB,#F8F8F3);
				font-size: 12px;
				line-height: 28px;
			}
			 a{
				color: #1A66B3;
				text-decoration: none;
			}
			a:hover{
				text-decoration: underline;
			}
			li{
				list-style: none;
			}
			li,img{
				vertical-align: middle;
			}
		</style>
	</head>
	<body>
		<h2>畅书书排行 <img src="bang.gif"></h2>
		<ul>
			<li>
				<img src="book_no01.gif" />
				<a href="#">不抱怨的世界（…</a>
			</li>
			<li>
				<img src="book_no02.gif" />
				<a href="#">不抱怨的世界（…</a>
			</li>
			<li>
				<img src="book_no03.gif" />
				<a href="#">不抱怨的世界（…</a>
			</li>
			<li>
				<img src="book_no04.gif" />
				<a href="#">不抱怨的世界（…</a>
			</li>
			<li>
				<img src="book_no05.gif" />
				<a href="#">不抱怨的世界（…</a>
			</li>
			<li>
				<img src="book_no06.gif" />
				<a href="#">不抱怨的世界（…</a>
			</li>
			<li>
				<img src="book_no07.gif" />
				<a href="#">不抱怨的世界（…</a>
			</li>
			<li>
				<img src="book_no08.gif" />
				<a href="#">不抱怨的世界（…</a>
			</li>
			<li>
				<img src="book_no09.gif" />
				<a href="#">不抱怨的世界（…</a>
			</li>
			<li>
				<img src="book_no10.gif" />
				<a href="#">不抱怨的世界（…</a>
			</li>
		</ul>
	</body>
</html>


